import {modifyPwd} from "@/services/system/auth/AuthService";
import {Button, Form, Input, message} from "antd";
import React, {useState} from 'react';

interface SecurityViewProps {
}

const SecurityView: React.FC<SecurityViewProps> = (props) => {

  const [form] = Form.useForm();
  const [loading, setLoading] = useState(false);

  return (
    <Form
      labelCol={{span: 24}}
      wrapperCol={{span: 24}}
      form={form}
      initialValues={{}}
      layout={'vertical'}
      name="login-form"
      autoComplete="off"
      onFinish={async (values) => {
        setLoading(true);
        modifyPwd(values).then(resp => {
          if (resp.flag) {
            message.success("修改成功");
          }
        }).finally(() => {
          setLoading(false);
        })
      }}
    >

      <Form.Item label="原密码" name={"oldPasswd"} rules={[{required: true}]}>
        <Input.Password/>
      </Form.Item>

      <Form.Item
        name={"newPasswd"}
        label="新密码"
        rules={[
          {
            required: true,
            pattern: /^.*(?=.+)(?=.*\d)(?=.*[a-zA-Z])(?=.*[~!@#$%^&*()_.]).{6,32}$/,
            message: '密码必须包含大写字母、数字、特殊字符且至少6位',
          },
        ]}
      >
        <Input.Password/>
      </Form.Item>

      <Form.Item
        name="confirmPassword"
        label="确认新密码"
        dependencies={['newPasswd']}
        hasFeedback
        rules={[
          {
            required: true,
          },
          ({getFieldValue}) => ({
            validator(rule, value) {
              if (!value || getFieldValue('newPasswd') === value) {
                return Promise.resolve();
              }
              return Promise.reject('与新密码不一致!');
            },
          }),
        ]}
      >
        <Input.Password/>
      </Form.Item>

      <Form.Item>
        <Button className={'login-submit-btn'} type="primary" htmlType="submit" loading={loading}>
          确定
        </Button>
      </Form.Item>
    </Form>
  )
};

export default SecurityView;
